<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>OA协同办公系统</title>
</head>
<style type="text/css" >
.divuser{ background:#EBEBEB; width:550px; height:350px; border:#CCC double 2px}
</style>
<link type="text/css" rel="stylesheet" href="css/table.css">
 <link rel="stylesheet" href="js/easyui/themes/default/easyui.css" />
   <link rel="stylesheet" href="js/easyui/themes/icon.css" />
  <script type="text/javascript" src="js/easyui/jquery-1.4.4.min.js"></script>
    <script type="text/javascript" src="js/easyui/jquery.easyui.min.js"></script>
        <script type="text/javascript" src="js/select.js"></script>
		<script type="text/javascript">
		$(function(){
             $('#tt2').tree({   
                  checkbox: false,   
                 url: 'organizationTree.action',   
                  onBeforeExpand:function(node,param){
                      $('#tt2').tree('options').url = "organizationChildTree.action?orgId="+ node.id;// change the url                       
                     
                  },               
                  onClick:function(node){
						  $(this).tree('toggle', node.target);
                       getOrg(node.id);
                  }   
              });   
              var obj = document.getElementById("obj2");
              var status=$("#status").val();
	       var initvalue = eval("["+opener.getOldValue(status)+"]");
	    if(initvalue!=''&&initvalue!=undefined){
	    	addAll(obj,initvalue);
	    }
         }); 
		
function getOrg(id){
	var  param={"orgId":id};
	$.post("getOrgByFlow.action",param,function(data){
		var org=data.org;
		var obj1=document.getElementById("obj1");
			addItem(obj1,org.id,org.name);
	},"json");

}
function func1(){
	var from = document.getElementById("obj1");
	var to = document.getElementById("obj2");
	moveTo(from,to);
	}
	function func2(){
	var from = document.getElementById("obj2");
	var to = document.getElementById("obj1");
	moveTo(from,to);
	}
	function func3(){
	var from = document.getElementById("obj1");
	var to = document.getElementById("obj2");
	moveAll(from,to);
	}
	function func4(){
	var from = document.getElementById("obj2");
	var to = document.getElementById("obj1");
	moveAll(from,to);
	}

 function addUser(){
 var status=$("#docId").val();
	var obj = document.getElementById("obj2");
	  var array = getSelectArray(obj);
	  opener.setNotiveValue(array,status);
	  window.close();
}

</script>

<body >
<input id="docId" type="hidden" value="${docId}">
<table align="center"><tr><td>
<div class="divuser">
<h1 style="background:url(image/usebg.jpg); height:30px; margin:0; text-align:center; line-height:30px; font-size:16px">
选择部门</h1>
<div id="tree-div" style="float:left; width:180px; height:320px; border:#666 double 1px;overflow-y:auto;overflow-x:none;word-break:break-all;">
<ul id="tt2">
                    
 </ul>
</div>
<div style="width:350px; height:320px; border:#666 double 1px; float:right;overflow-y:auto;  ">
	<table border="0"> 

              <tr>
                <td>
                  <select name="possible" id="obj1" size="4" MULTIPLE style="width: 130px; height:310px;">
                    
                  </select>
                </td>
                <td>
                <input type="button"     onclick="func1()" class="button_02" value=">">
                <input type="button" onclick="func3()" class="button_02" value=">>">
				  <br><br>
                  <input type="button"   class="button_02" onclick="func2()" value="<">
                  <input type="button" width="25px" onclick="func4()" class="button_02" value="<<">
                  <br /><br />
                  <input type="button" onclick="addUser()" width="25px" class="button_02" value="确定">
				</td>
                <td>
                  <select name="chosen" id="obj2" size="4" MULTIPLE style="width: 130px;height:310px">
                     
                  </select>
                </td>
              </tr>  
            </table>
</div>
</div>
</td></tr></table>
</body>
</html>